{% extends "base_logged.html" %}
{% block page %}
<div id="page-wrapper">

<div class="row">
  <div class="col-lg-12">
    <h1>List of executed jobs</h1>
    <ol class="breadcrumb">
      <li><a href="{{ url_for('index') }}"><i class="fa fa-dashboard"></i> SaltPad</a></li>
      <li class="active"><i class="fa fa-history"></i> Jobs history</li>
    </ol>
  </div>
</div><!-- /.row -->

<div class="row">
  <div class="col-lg-12">
    <h2>Jobs</h2>
    <div class="table-responsive">
      <table class="table table-bordered table-hover" id="jobs">
        <thead>
          <tr>
            <th>JID</i></th>
            <th>Target</i></th>
            <th>Function</i></th>
            <th>Arguments</th>
            <th>Launched At</th>
            <th>User</th>
            <th>Output</th>
          </tr>
        </thead>
        <tbody>
          {% for jid, job_data in jobs %}
          <tr>
            <td>{{ jid }}</td>
            <td>{{ job_data.Target }}</td>
            <td>{{ job_data.Function }}</td>
            <td>{{ job_data.Arguments|format_arguments }}</td>
            <td>{{ job_data.StartTime }}</td>
            <td>{{ job_data.User }}</td>
            {% if job_data.Function == 'state.highstate' %}
              {% set renderer='highstate' %}
            {% else %}
              {% set renderer='raw' %}
            {% endif %}
            <td><a href="{{ url_for('job_result', jid=jid, renderer=renderer) }}">Output</a></td>
          </tr>
          {% endfor %}
        </tbody>
      </table>
    </div>
  </div>
  </div>
</div><!-- /.row -->
{% endblock %}

{% block scripts %}
<script type="text/javascript">
$(function() {
  $("#jobs").dataTable({
    "order": [[0, "desc"]],
    "lengthMenu": [[20, 50, 100, -1], [20, 50, 100, "All"]],
    "columnDefs": [
      { "orderable": false, "targets": -1 }
    ]
  });
});
</script>
{% endblock %}
